.luck-draw-main {
    position: relative;

    overflow: hidden;

    width: 100%;
    height: 100%;

    background-size: 100% 100% !important;

    .common-explain {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 130rpx;
        height: 43rpx;

        color: #ffffff;
        border-radius: 181rpx 0rpx 0rpx 181rpx;
        background: rgba(0, 0, 0, 0.4);

        font-family: PingFangSC-Regular, PingFang SC;
        font-size: 24rpx;
        font-weight: 400;
    }
    .luck-rule {
        position: absolute;
        z-index: 3;
        top: 36rpx;
        right: 0;

        @extend .common-explain;
    }
    .winning-record {
        position: absolute;
        z-index: 3;
        top: 100rpx;
        right: 0;

        @extend .common-explain;
    }
    .luck-container {
        position: absolute;
        top: 80rpx;
        right: 0;
        bottom: 0;
        left: 0;

        width: 100%;
        height: 1000rpx;
        margin: 0 auto;

        background-size: 100% 100% !important;
        .horn {
            position: absolute;
            top: 0;
            top: 0;
            left: 0;
            left: 180rpx;

            width: 100%;
            height: 79rpx;

            color: #333333;

            font-family: PingFangSC-Regular, PingFang SC;
            font-size: 27rpx;
            font-weight: 400;
            line-height: 79rpx;
            .horn-item {
                height: 79rpx !important;

                line-height: 79rpx;
            }
        }
        .luck-item-container {
            position: absolute;
            bottom: 178rpx;
            left: 80rpx;
        }
        .luck-item {
            position: relative;

            display: block;
            float: left;

            box-sizing: border-box;
            width: 181rpx;
            height: 192rpx;
            margin: 10rpx;

            text-align: center;

            border-radius: 10rpx;
            background-size: 100% 100% !important;

            font-size: 28rpx;
            line-height: 162rpx;

            .setup-title {
                position: absolute;
                z-index: 9;
                top: 0;
                left: 0;

                display: flex;
                align-items: center;
                flex-flow: column;
                justify-content: center;

                box-sizing: border-box;
                width: 100%;
                height: 100%;
                margin: auto;

                text-align: center;

                color: #d04011;

                font-size: 30rpx;
                line-height: 40rpx;
                .prize-img {
                    width: 123rpx;
                    height: 123rpx;
                }
                .name {
                    color: #76340b;

                    font-family: PingFangSC-Regular, PingFang SC;
                    font-size: 22rpx;
                    font-weight: 400;
                }
                .lotteryImg {
                    width: 200rpx;
                    height: 200rpx;
                }
            }
            .click-draw {
                width: 181rpx;
                height: 192rpx;

                background-size: 100% 100% !important;
                .click-index {
                    .luck-btn {
                        height: 72rpx;

                        letter-spacing: 5rpx;

                        color: #ffffff;
                        text-shadow: 0px 4rpx 2rpx #ba0905;

                        font-family: PingFangSC-Semibold, PingFang SC;
                        font-size: 51rpx;
                        font-weight: 600;
                    }
                    .luck-status {
                        height: 31rpx;

                        color: #ffffff;

                        font-family: PingFangSC-Regular, PingFang SC;
                        font-size: 22rpx;
                        font-weight: 400;
                    }
                }
            }
        }
        .active {
            .active-view {
                position: absolute;
                z-index: 1;
                top: 0;
                left: 0;

                width: 181rpx;
                height: 199rpx;

                border: 5rpx solid #fe292b;
                border-radius: 18rpx;
            }
        }
    }
    .share-bg {
        position: absolute;
        bottom: 60rpx;
        left: 16rpx;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 720rpx;
        height: 243rpx;

        background-size: 100% 100% !important;
        .share-container {
            display: flex;
            align-items: center;
            justify-content: space-between;

            width: 627rpx;
            height: 130rpx;
            margin-top: 36rpx;
            padding: 0 22rpx;

            border-radius: 14px;
            background: rgba(241, 70, 0, 0.2);
            .share-left {
                display: flex;
                align-items: center;
                .img-container {
                    display: flex;
                    align-items: center;
                    justify-content: center;

                    width: 87rpx;
                    height: 87rpx;
                    margin-right: 18rpx;

                    border-radius: 50%;
                    background: #fff;
                    .img {
                        width: 51rpx;
                        height: 45rpx;
                    }
                }
                .text {
                    .text-top {
                        color: #ffffff;

                        font-family: PingFangSC-Medium, PingFang SC;
                        font-size: 25rpx;
                        font-weight: 500;
                    }
                    .text-bottom {
                        color: #ffffff;

                        font-family: PingFangSC-Regular, PingFang SC;
                        font-size: 24rpx;
                        font-weight: 400;
                    }
                }
            }
            .share-right {
                display: flex;
                align-items: center;
                justify-content: center;

                color: #76340b;
                border-radius: 27rpx;
                background: linear-gradient(180deg, #fff1ce 0%, #ffb63c 100%);

                font-family: PingFangSC-Regular, PingFang SC;
                font-size: 25rpx;
                font-weight: 400;
            }
            .no-login {
                padding: 9rpx 18rpx;
            }
            .no-share {
                padding: 9rpx 18rpx;

                background: linear-gradient(180deg, #efefef 0%, #cccccc 100%);
            }
        }
    }
    .bg-common {
        position: fixed;
        z-index: 10000;
        top: 0;
        left: 0;

        width: 100vw;
        height: 100vh;

        background: rgba(0, 0, 0, 0.2);
    }
    .rule-container-bg {
        @extend .bg-common;
        .rule-container {
            position: absolute;
            top: 16%;
            left: 7%;

            width: 605rpx;
            padding: 22rpx;

            border-radius: 22rpx;
            background: #ffffff;
            .title {
                margin-bottom: 25rpx;

                color: #333333;

                font-family: PingFangSC-Medium, PingFang SC;
                font-size: 29rpx;
                font-weight: 500;
                line-height: 43rpx;
            }
            .rule-detail {
                overflow-y: scroll;

                max-height: 800rpx;

                color: #333333;

                font-family: PingFangSC-Regular, PingFang SC;
                font-size: 25rpx;
                font-weight: 400;
                line-height: 40rpx;

                .red {
                    color: #fe292b;
                }
            }
        }
    }
    .winning-result {
        @extend .bg-common;
        .res-container {
            position: absolute;
            top: 12%;
            left: 0;

            display: flex;
            align-items: center;
            flex-direction: column;

            width: 697rpx;
            height: 754rpx;
            padding: 22rpx;

            text-align: center;

            border-radius: 22rpx;
            background: #ffffff;
            background-size: 100% 100% !important;
            .title {
                margin-top: 130rpx;

                color: #ff3e4a;

                font-family: PingFangSC-Semibold, PingFang SC;
                font-size: 40prx;
                font-weight: 600;
            }
            .img {
                width: 145rpx;
                height: 145rpx;
            }
            .winning-img {
                margin: 43rpx 0 29rpx 0;
            }
            .fail-img {
                margin: 62rpx 0 47rpx 0;
            }
            .text {
                color: #333333;

                font-family: PingFangSC-Regular, PingFang SC;
                font-size: 29rpx;
                font-weight: 400;
            }
            .sub-text {
                margin-top: 25rpx;

                color: #c08c8f;

                font-family: PingFangSC-Regular, PingFang SC;
                font-size: 25rpx;
                font-weight: 400;
            }
            .winning-result-btn {
                position: absolute;
                bottom: 80rpx;

                width: 409rpx;
                height: 80rpx;

                color: #76340b;
                border-radius: 40rpx;
                background: linear-gradient(180deg, #fff1ce 0%, #ffb63c 100%);
                box-shadow: 0px 7rpx 22rpx 0px rgba(215, 28, 42, 0.5);

                font-family: PingFangSC-Medium, PingFang SC;
                font-size: 29rpx;
                font-weight: 500;
                line-height: 80rpx;
            }
            .winning-result-close {
                position: absolute;
                bottom: -75rpx;

                display: flex;
                justify-content: center;

                width: 100%;
                .result-close-img {
                    width: 58rpx;
                    height: 58rpx;
                }
            }
            .result-close-btn {
                width: 409rpx;
                height: 80rpx;

                color: #ffffff;
                border: 2rpx solid #ffffff;
                border-radius: 40rpx;
                background: none;
                box-shadow: 0px 7rpx 22rpx 0rpx rgba(215, 28, 42, 0.5);

                font-family: PingFangSC-Medium, PingFang SC;
                font-size: 29rpx;
                font-weight: 500;
                line-height: 80rpx;
            }
        }
    }
}
